import {renderAreaNode} from "../function/renderAreaNode";
// import addTipmark from "./tipMark";
import {addDeClick} from "../function/deClick";
import $ from "jquery";

export default {
    mounted() {
        let that = this;
        AMapUI.loadUI(['geo/DistrictExplorer'], function (DistrictExplorer) {
            that.initPage(DistrictExplorer, that.adcode, that.map, that);
        });
    },
    methods: {
        initPage: function (DistrictExplorer, adcode, map, that) {
            // de对象

            let districtExplorer = new DistrictExplorer({
                eventSupport: true, //打开事件支持
                map: map,
                zIndex: 8,
                bubble: true
            });
            // -------- 绘制节点 --------------
            districtExplorer.loadAreaNode(adcode, function (error, areaNode) {
                if (error) {
                    console.error(error);
                    return;
                }
                renderAreaNode(districtExplorer, areaNode, map);
            });
            this.addTipmark(districtExplorer, map);
            addDeClick(districtExplorer, adcode, map, that);
        },
        addTipmark: function (districtExplorer, map) {
            // --------------sssss------------------
            let tipMarkerContent = $(
                '<div style="color:white;font-size:25px;width:10vw"></div>'
            );
            let tipMarker = new AMap.Marker({
                content: tipMarkerContent.get(0),
                offset: new AMap.Pixel(0, 0),
                bubble: true,
                zIndex: 999,
            });
            //监听feature的hover事件
            districtExplorer.on("featureMouseout featureMouseover", function (e, feature) {
                // --------------sssss------------------
                toggleHoverFeature(
                    feature,
                    e.type === "featureMouseover",
                    e.originalEvent ? e.originalEvent.lnglat : null
                );
            });
            //监听鼠标在feature上滑动
            districtExplorer.on("featureMousemove", function (e) {
                //更新提示位置
                tipMarker.setPosition(e.originalEvent.lnglat);
            });

            // ------- 鼠标滑过提示 --------------
            function toggleHoverFeature(feature, isHover, position) {

                tipMarker.setMap(isHover ? map : null);

                if (!feature) {
                    return;
                }

                let props = feature.properties;
                if (isHover) {
                    tipMarkerContent.html(props.name);
                    //更新位置
                    tipMarker.setPosition(position ? position : props.center);
                }
            }
        }
    }
}